<template>
  <el-dialog :close-on-click-modal="false" :visible.sync="open" append-to-body width="80vw">
    <div class="app-container">

          <el-card class="box-card">
            <el-container>
              <el-header>
                <h1>{{ form.name }}的简历</h1>
              </el-header>
              <el-main>
                <el-form ref="form" :model="form" :rules="rules" label-width="80px">
                  <!--  个人基本信息部门-->
                  <el-descriptions :column="3" border class="margin-top" size="medium" title="个人基本信息">
                    <template slot="extra">
                    </template>
                    <el-descriptions-item>
                      <template slot="label">
                        姓名
                      </template>
                      <span>{{ form.name }}</span>
                    </el-descriptions-item>
                    <el-descriptions-item>
                      <template slot="label">
                        性别
                      </template>
                      <span>{{ form.sex }}</span>
                    </el-descriptions-item>
                    <el-descriptions-item>
                      <template slot="label">
                        年龄
                      </template>
                      <span>{{ form.age }}</span>
                    </el-descriptions-item>
                    <el-descriptions-item>
                      <template slot="label">
                        学校
                      </template>
                      <span>{{ form.school }}</span>
                    </el-descriptions-item>
                    <el-descriptions-item>
                      <template slot="label">
                        专业
                      </template>
                      <span>{{ form.major }}</span>
                    </el-descriptions-item>
                  </el-descriptions>

                  <!--能力部分-->
                  <el-descriptions :column="2" border class="margin-top" size="medium" title="个人能力">
                    <el-descriptions-item label="班级职位">
                      <span> {{ classPositionFormat(form.classPosition) }} </span>
                    </el-descriptions-item>
                    <el-descriptions-item label="学校职位">
                      <span> {{ schoolPositionFormat(form.schoolPosition) }} </span>

                    </el-descriptions-item>
                    <el-descriptions-item label="校外职位">
                      <span> {{ outsideSchoolPositionFormat(form.outsideSchoolPosition) }} </span>

                    </el-descriptions-item>
                    <el-descriptions-item label="英语能力">
                      <span> {{ englishAbilityFormat(form.englishAbility) }} </span>
                    </el-descriptions-item>
                    <el-descriptions-item label="奖学金">
                      <span> {{ scholarshipFormat(form.scholarship) }} </span>

                    </el-descriptions-item>
                    <el-descriptions-item label="C刊数量">
                      <span>{{ form.cPaper }}</span>
                    </el-descriptions-item>
                    <el-descriptions-item label="核心期刊数量">
                      <span>{{ form.corePaper }}</span>
                    </el-descriptions-item>
                    <el-descriptions-item label="课题">
                      <span> {{ subjectFormat(form.subject) }} </span>
                    </el-descriptions-item>
                    <el-descriptions-item label="专利">
                      <span>{{ form.patent }}</span>
                    </el-descriptions-item>
                    <el-descriptions-item label="比赛获奖">
                      <span> {{ winnerTypeFormat(form.winner) }} </span>

                    </el-descriptions-item>
                    <el-descriptions-item label="获奖次数">
                      <span>{{ form.winnerCount }}</span>
                    </el-descriptions-item>
                  </el-descriptions>

                  <!--实习经历-->
                  <div class="description-title margin-top">实习经历</div>
                  <div class="margin-top">
                    <p>{{ form.internship }}</p>
                  </div>

                  <!--股票安全性-->
                  <el-descriptions :column="1" border class="margin-top" size="medium" title="股票安全性">
                    <el-descriptions-item label="导师背书">
                      <span> {{ endorsementFormat(form.endorsement) }} </span>
                    </el-descriptions-item>
                    <el-descriptions-item label="保证金缴纳">
                      <span> {{ marginFormat(form.margin) }} </span>
                    </el-descriptions-item>
                  </el-descriptions>

                  <!--证明材料-->
                  <div class="description-title margin-top">证明材料</div>
                  <div class="margin-top">
                    <el-upload
                      :action="upload.url"
                      :auto-upload="true"
                      :disabled="true"
                      :file-list="upload.fileList"
                      :headers="upload.headers"
                      :limit="20"
                      class="upload-demo"
                      multiple>
                      <div slot="tip" class="el-upload__tip">上传指标涉及的本人的所有证明材料，必须保证上传信息准确性</div>
                    </el-upload>
                  </div>
                </el-form>
                <div class="description-title margin-top">自我描述</div>
                <div class="margin-top">
                  <div v-html="showMyStory.myStory"></div>
                </div>
                <div class="description-title margin-top">我的视频</div>
                <div>
                  <video v-if="showMyStory.url !=='' && showMyStory.url !== null" :src="showMyStory.url"
                         class="avatar video-avatar"
                         controls="controls">您的浏览器不支持视频播放
                  </video>
                </div>
              </el-main>

              <el-footer>
                <el-button class="button-save" @click="cancel">关 闭</el-button>
              </el-footer>
            </el-container>
          </el-card>

    </div>
  </el-dialog>
</template>

<script>
import {getResumeToBelongs} from "@/api/publish/resume";
import {getToken} from "@/utils/auth";
import {getSysFile} from "@/api/system/sysFile";
import {getMyStory, saveStory,getUserStory} from "@/api/publish/story/story";

export default {
  name: "ResumeDetail",
  data() {
    return {
      // 是否显示弹出层
      open: false,
      // 表单参数
      form: {},
      // 表单校验
      rules: {},
      // 班级职位字典
      classPositionOptions: [],
      // 学校职位字典
      schoolPositionOptions: [],
      // 学校职位字典
      outsideSchoolPositionOptions: [],
      // 英语能力字典
      englishAbilityOptions: [],
      // 奖学金字典
      scholarshipOptions: [],
      // 课题字典
      subjectOptions: [],
      // 导师背书字典
      endorsementOptions: [],
      // 保证金缴纳字典
      marginOptions: [],
      // 比赛获奖
      winnerTypeOptions: [],
      showMyStory: {},
      // 上传参数
      upload: {
        // 是否禁用上传
        isUploading: false,
        // 设置上传的请求头部
        headers: {Authorization: "Bearer " + getToken()},
        // 上传的地址
        url: process.env.VUE_APP_BASE_API + "/common/upload",
        // 上传的文件列表
        fileList: []
      },
      // 设置面板展开
      activeNames: ['2'],
    }
  },
  created() {
    this.getDicts("has_status").then(response => {
      this.classPositionOptions = response.data;
    });
    this.getDicts("has_status").then(response => {
      this.schoolPositionOptions = response.data;
    });
    this.getDicts("has_status").then(response => {
      this.outsideSchoolPositionOptions = response.data;
    });
    this.getDicts("ability_status").then(response => {
      this.englishAbilityOptions = response.data;
    });
    this.getDicts("scholarship").then(response => {
      this.scholarshipOptions = response.data;
    });
    this.getDicts("subject").then(response => {
      this.subjectOptions = response.data;
    });
    this.getDicts("has_status").then(response => {
      this.endorsementOptions = response.data;
    });
    this.getDicts("margin").then(response => {
      this.marginOptions = response.data;
    });
    this.getDicts("winner_type").then(response => {
      this.winnerTypeOptions = response.data;
    });
  },
  methods: {

    // 取消按钮
    cancel() {
      this.open = false
      this.reset()
    },

    // 展开面板
    handleChange(val) {
    },

    // 查询自己的故事
    getStory(userId) {
      const _this = this;
      getUserStory(userId).then(response => {
        if (response && response.code === 200) {
          _this.showMyStory = response.data;
        }
      })
    },

    // 查询自己的简历
    init(userId) {
      const _this = this;
      getResumeToBelongs(userId).then(async response => {
        if (response && response.code === 200) {
          _this.form = response.data;
          let fileIdArr = _this.form.evidence.split(',');
          for (let i = 0; i < fileIdArr.length; i++) {
            if (fileIdArr[i]) {
              await getSysFile(fileIdArr[i]).then(res => {
                if (res && res.code === 200) {
                  _this.upload.fileList.push({
                    name: res.data.originalFilename,
                    url: res.data.filePath,
                    id: res.data.fileId,
                  })
                }
              })
            }
          }
        }
      })
    },

    // 班级职位字典翻译
    classPositionFormat(value) {
      return this.selectDictLabel(this.classPositionOptions, value);
    },
    // 学校职位字典翻译
    schoolPositionFormat(value) {
      return this.selectDictLabel(this.schoolPositionOptions, value);
    },
    // 学校职位字典翻译
    outsideSchoolPositionFormat(value) {
      return this.selectDictLabel(this.outsideSchoolPositionOptions, value);
    },
    // 英语能力字典翻译
    englishAbilityFormat(value) {
      return this.selectDictLabel(this.englishAbilityOptions, value);
    },
    // 奖学金字典翻译
    scholarshipFormat(value) {
      return this.selectDictLabel(this.scholarshipOptions, value);
    },
    // 课题字典翻译
    subjectFormat(value) {
      return this.selectDictLabel(this.subjectOptions, value);
    },
    // 导师背书字典翻译
    endorsementFormat(value) {
      return this.selectDictLabel(this.endorsementOptions, value);
    },
    // 保证金缴纳字典翻译
    marginFormat(value) {
      return this.selectDictLabel(this.marginOptions, value);
    },
    // 比赛获奖字典翻译
    winnerTypeFormat(value) {
      return this.selectDictLabel(this.winnerTypeOptions, value);
    },

    // 表单重置
    reset() {
      this.form = {
        id: null,
        name: null,
        sex: null,
        age: null,
        school: null,
        major: null,
        classPosition: "0",
        schoolPosition: "0",
        outsideSchoolPosition: "0",
        englishAbility: null,
        scholarship: null,
        paper: null,
        subject: null,
        cPaper: null,
        patent: null,
        corePaper: null,
        winner: null,
        endorsement: null,
        margin: null,
        internship: null,
        deptId: null,
        winnerCount: null,
        createBy: null,
        createById: null,
        createTime: null,
        updateBy: null,
        updateById: null,
        updateTime: null,
        remark: null
      };
      this.resetForm("form");
    },
  },


}
</script>

<style scoped>
.app-container {
  background: #F0F2F5;
}

.margin-top {
  margin-top: 20px;
}

.description-title {
  font-size: 16px;
  font-weight: bold;
}

.button-save {
  display: block;
  margin: 20px auto;
}
</style>
